(function ($) {
  "use strict";
  /*
  * author GL
  * params = {
  * }
  * */
  $.formedit = function (option) {
    var defaults = {
      saveFn: function () {},
      form: [{
        item: '基本信息',
        list: [
          {
            type: 'text',
            name: '中文姓',
            placeholder: '请与证件保持一致',
            required: true,
            curval: 'test'
          },
          {
            type: 'select',name: '下拉选择',placeholder: '请选择',
            select: {
              title: "测试3",
              item: [{
                nav: '游客类型',
                option: ['成人', '儿童', '长者']
              }, {
                nav: '性别',
                option: ['男', '女']
              }]
            }
          },
          {
            type: 'radio',name: '单选',
            item: {
              name: 'test',
              option: ['单选1','单选2']
            }
          },
          {
            type: 'checkbox',name: '复选',
            item: {
              option: ['复选1','复选2']
            }
          }
        ]
      },{
        item: '证件信息',
        list: [
          {
            type: 'code',
            name: '身份证',
            placeholder: '请输入证件号码'
          },
          {
            type: 'date',
            name: '证件有效期',
            placeholder: '请选择有效期'
          }
        ]
      },{
        item: '其他信息',
        list: [
          {type: 'date',name: '生日',placeholder: '请与证件保持一致'},
          {
            type: 'radio',name: '性别',
            item: {
              name: 'sex',
              option: ['男','女']
            }
          }
        ]
      }]
    };
    var params = $.extend({},defaults,option);
    var tpl = '<div class="gzl-page gzl-formedit">'+
    '<div class="gzl-section"></div>'+
    '<div class="gzl-footbar"><div class="gzl-flex__item"><div class="btn save-btn">保存</div></div></div>'+
    '</div>';
    var formedit = $(tpl).appendTo(document.body);
    var section = $(".gzl-section",formedit);
    $.each(params.form,function (i,e) {
      section.append('<div class="gzl-cell__title">'+e.item+'</div>')
      $.each(e.list,function (j,list) {
        var cell = $('<div class="gzl-cell"></div>').appendTo(section);
        if (list.type==='code') {// 证件选择
          cell.append(
            '<div class="gzl-label code-sel"><span>'+list.name+'</span><svg class="icon"><use xlink:href="#icon-arrow-right"></use></svg></div>'+
            '<div class="gzl-cell__bd"><input class="gzl-input" placeholder="'+list.placeholder+'"></div>'
          );
        } else if (list.type==='select') {// 下拉选择
          var select = $(
            '<div class="gzl-label">'+list.name+'</div>'+
            '<div class="gzl-cell__bd"><div class="gzl-select placeholder">'+list.placeholder+'</div></div>'
          ).appendTo(cell);
          $(".gzl-select",select).select(list.select);
        } else if (list.type==='radio' || list.type==='checkbox') {// 单选、多选
          var option = '';
          var check = $(
            '<div class="gzl-label">'+list.name+'</div>'+
            '<div class="gzl-cell__bd"><div class="gzl-option"></div></div>'
          ).appendTo(cell);
          $.each(list.item.option, function (k,item) {
            option += '<label><input type="'+(list.type==='checkbox'?'checkbox"':'radio" name="'+list.item.name+'"')+'><span>'+item+'</span></label>'
          })
          $(".gzl-option",check).append(option);
        } else if (list.type==='date') {// 日期选择
          cell.addClass("gzl-cell_access").append(
            '<div class="gzl-label">'+list.name+'</div>'+
            '<div class="gzl-cell__bd form-calendar"><div class="placeholder" data-target="cur">'+list.placeholder+'</div></div>'+
            '<div class="gzl-cell__ft"></div>'
          );
        } else {// 普通输入
          cell.append(
            '<div class="gzl-label">'+list.name+(list.required?'<span class="required">*</span>':'')+'</div>'+
            '<div class="gzl-cell__bd"><input class="gzl-input" placeholder="'+list.placeholder+'" '+(list.curval?'value="'+list.curval+'"':'')+'></div>'
          );
        }
      })
    })
    formedit.show().addClass("show");
    $(".code-sel",formedit).on("click", function () {
      var self = $(this);
      $.select({
        target: $(">span",self),
        title: '选择证件类型',
        item: [{
          option: [
            {name: '身份证',type: 'IDCard'}, 
            {name: '护照', type: 'PassPort'}, 
            {name: '通行证', type: 'Pass'},
            {name: '军官证',type: 'MilitaryID'},
            {name: '户口本',type: 'AccountBook'},
            {name: '出生证',type: 'BirthCert'}, 
            {name: '台胞证',type: 'MTPs'},
            {name: '台湾通行证',type: 'InputTCard'},
            {name: '其他',type: 'qita'}
          ]
        }]
      });
    });
    $(".save-btn", formedit).on("click", function () {
      params.saveFn();
    })
  };
  $.hideFormedit = function () {
    $(".gzl-formedit").removeClass("show").transitionEnd(function () {
      this.remove();
    })
  }
})($);